// ----------------后台页面js------------------

//-----------------获取数据-------------------
let url1
console.log(localStorage.getItem('token'));
$.ajax({
    url: '/my/user/userinfo',
    success: function(res) {
        if (res.status == 0) {
            layer.msg(`欢迎${res.data.nickname}`)
        }
    }

})
let url12
$.ajax({
  url: '/my/user/userinfo',
  success: function (res) {
    if (res.status == 0) {
      //  -----------判断有无昵称---------
      if (res.data.nickname == null) {
        layer.msg(`欢迎${res.data.username}`)
        $('.suer').text(res.data.username);

      } else {


        $('.suer').text(res.data.nickname);
      }
      //  -----------判断有无昵称结束---------
      // -----------判断有无头像---------
      if (res.data.user_pic == null) {

        if (res.data.nickname != null) {
          $('.spantp2').text('')
          $('.spantp2').show().text(res.data.nickname.charAt(0.1));

        } else {
          $('.spantp2').show().text(res.data.username.charAt(0, 1));
        }

        console.log();
        url1 = "./assets/images/sample2.jpg";
        url12 = "./assets/images/sample2.jpg"
        $('.spantp1').text('').hide()
      } else {
        $('.spantp2').text(res.data.nickname.charAt(0.1));
        $('.spantp1').show();
        $('.spantp2').hide()
        url12 = res.data.user_pic;

        image.cropper('replace', url12)
        $('.spantp1 img').attr('src', res.data.user_pic);


      }
      // -----------判断有无头像结束--------
    }
    let form = layui.form;
    form.val('abc', res.data)






  }

})
function ajaxa() {
    $.ajax({
        url: '/my/user/userinfo',
        success: function(res) {
            if (res.status == 0) {
                //  -----------判断有无昵称---------
                if (res.data.nickname == null) {

                    $('.suer').text(res.data.username);
                  $('.spantp2').show().text(res.data.username.charAt(0, 1));
                } else {
                  $('.spantp2').show().text(res.data.nickname.charAt(0, 1));
                    $('.suer').text(res.data.nickname);
                }
                //  -----------判断有无昵称结束---------
                // -----------判断有无头像---------
                if (res.data.user_pic == null) {
                  $('.spantp2').show().text(res.data.username.charAt(0, 1));
                  if (res.data.nickname != null) {
                    $('.spantp2').text('')
                    $('.spantp2').show().text(res.data.nickname.charAt(0.1));

                  }
                  console.log();
                  url2 = './assets/images/sample2.jpg'
                  url1 = './assets/images/sample2.jpg'
                    $('.spantp1').text('').hide()
                } else {
                  $('.spantp1').show();
                  $('.spantp2').hide()
                  url2 = res.data.user_pic
                  image.cropper('replace', url2)
                    $('.spantp1 img').attr('src', res.data.user_pic);


                }
                // -----------判断有无头像结束--------
            }
            let form = layui.form;
            form.val('abc', res.data)






        }

    })
}


    //-----------------获取数据结束-------------------
    // -------------------点击切换-------------------

// ======================类别管理标记、删除==================
$("tbody").on('click', '.mn', function(e) {
        e.preventDefault();
        let id = parseInt($(this).data('idd'))
        console.log(id);
        layer.confirm('你确定要删除吗？？', {
            btn: ['确定', 'NO'] //按钮
        }, function() {

            $.ajax({
                url: `/my/article/delete/${id}`,

                success: function(res) {
                    layer.msg(res.message, { icon: 1 });
                    data_s()
                }

            })

        }, function() {
            layer.msg('行叭', );
        });

    })
    //=======================编辑=======================
let iddd
$('tbody').on('click', '.akkk', function() {

    $('.xgwzmin').show().siblings().hide();
    iddd = $(this).data('id')
    console.log()
    city()
    $.ajax({
        url: `/my/article/${iddd}`,

        success: function(res) {
            console.log(res)
            if (res.status == 0) {
                console.log(res.data.content);
                console.log(res.data.cate_id);
                layer.msg(res.message);


                city1();
                ajaxa()
                let form = layui.form;
              form.render('#xg');

              image32.cropper('replace', `http://www.itcbc.com:8080/${res.data.cover_img}`)
                $('#xg input[name=title]').val(res.data.title);
                $('#xg input[name=cate_id]').val();
                tinyMCE.activeEditor.setContent(res.data.content);
                if (res.data.state == '已发布') {
                    $('#yifabu').attr('checked', true);
                    $('#caogao').attr('checked', false);
                } else {
                    $('#caogao').attr('checked', true);
                    $('#yifabu').attr('checked', false)
              };






            }
        }
    })

});
let image32 = $('#image2');
let option12 = {
    aspectRatio: 400 / 280,
    preview: '.img-preview12'

};
image32.cropper(option12);
$('#xgsc').on('click', function() {
    $('#wenj').trigger('click')
})
$('#wenj').on('change', function() {
    if (this.files.length > 0) {
        let fileObj = this.files[0];
        url1 = URL.createObjectURL(fileObj);
        image32.cropper('replace', url1)
    }
});


$('#qrxg').on('click', function(e) {
    e.preventDefault();
    let gh = document.querySelector('#xg');
    let form = new FormData(gh);

    form.append('id', iddd)

    let canvas = image32.cropper('getCroppedCanvas', { width: 400, height: 280 });



    form.set('content', tinyMCE.activeEditor.getContent());
    canvas.toBlob(function(blob) {
        form.append('cover_img', blob);
        $.ajax({
            url: '/my/article/update',
            type: 'POST',
            data: form,
            processData: false,
            contentType: false,

            success: function(res) {
                layer.msg(res.message);
                $('.wzlbmin').show().siblings().hide();
              city();
              data_s();
              city1()
            }
        })




    })

    form.forEach((value, key) => {
        console.log(key, value);
    })


})






// ======================类别管理标记、删除end==================



//渲染数据到分类------------------
let data_A = {
        pagenum: 1,
        pagesize: 2
    }
    // ===================添加文章===================
let image3 = $('#image1');
let option1 = {
  aspectRatio: 280 / 400,
    preview: '.img-preview1'

};
image3.cropper(option1);
$('.sc').on('click', function() {
    $('#file1').trigger('click')
})
$('#file1').on('change', function() {
    if (this.files.length > 0) {
        let fileObj = this.files[0];
        url1 = URL.createObjectURL(fileObj);
        image3.cropper('replace', url1)
    }
});
let gh = document.querySelector('#ace')
$('.qd').on('click', function() {

    let form = new FormData(gh);
  let canvas = image3.cropper('getCroppedCanvas', { width: 200, height: 480 });
    $('.mmm').html(tinyMCE.activeEditor.getContent());
    console.log();
    form.set('content', $('.mmm').find('p').text());

    canvas.toBlob(function(blob) {
        form.append('cover_img', blob);


      yibu(form);
      $('.wzlbmin').show().siblings().hide();
      data_s()


    })

})

function yibu(f) {
    $.ajax({
        url: '/my/article/add',
        type: 'POST',
        data: f,
        processData: false,
        contentType: false,
        success: function(res) {
            if (res.status == 0) {
                layer.msg(res.message);
                $('#ace input[name=title]').val('');
              tinyMCE.activeEditor.setContent('');


            }
        }
    })
}
// $('#ace').on('submit', function(e) {
//         e.preventDefault()

//     })
// ===================添加文章end===================

function data_s() {

    $.ajax({
        url: '/my/article/list',
        data: data_A,
        success: function(res) {
            console.log(res)
            if (res.status == 0) {
                let as = '';
                res.data.forEach(itme => {

                    as += `
                                <tr>
                                    <td>${itme.title}</td>
                                    <td>${itme.cate_name}</td>
                                    <td>${ itme.pub_date}</td>
                                    <td>${itme.state}</td>
                                    <td>
                                    <button type="button" data-id=${itme.id}  data-alias=${itme.alias} class="layui-btn layui-btn-xs akkk">编辑</button>
                                        <button type="button" data-idd=${itme.id} class="layui-btn  layui-btn-danger  layui-btn-xs  mn" >删除</button>
                                    </td>
                                </tr>
            `;



                });
                $('.tbody3').html(as);
                peizhi(res.total)

            }
        }
    })
}
//渲染数据到分类end------------------
data_s()
    // ----------------------分页----------------------
function peizhi(t) {
    console.log(data_A.pagesize, 'l')
    var laypage = layui.laypage;

    //执行一个laypage实例
    laypage.render({
        elem: 'qwer',
        count: t,
        limit: data_A.pagesize,
        limits: [2, 3, 5, 10, 15],
        curr: data_A.pagenum,
        layout: ['limit', 'prev', 'page', 'next', 'count', 'skip'],
        jump: function(obj, first) {
            //obj包含了当前分页的所有参数，比如：
            console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
            console.log(obj.limit); //得到每页显示的条数

            //首次不执行
            if (!first) {
                data_A.pagenum = obj.curr;
                data_A.pagesize = obj.limit;
                data_s()
            }

        }
    });
}
// ----------------------分页----------------------
// ====================分类操作下拉=====================
function city1() {
    $.ajax({
        url: '/my/category/list',
        data: data_A,
        success: function(res) {
            if (res.status == 0) {
                $('#city_top').html('');
                $('#city_buttom').html('');
                let top = ''
                res.data.forEach(itme => {
                    top += `
            <option value=${itme.id}>${itme.name}</option>
            `;
                    $('#city_top').append(top);
                    let form = layui.form;
                    form.render('#ace')
                    $('#city_buttom').append(top);
                    $('#city_buttom1').append(top);

                })
            }
        }
    })
}

function city() {
    $.ajax({
        url: '/my/category/list',
        data: data_A,
        success: function(res) {
            if (res.status == 0) {
                $('#city_top').html('');
                $('#city_buttom').html('');
                let top = ''
                res.data.forEach(itme => {
                    top += `
            <option value=${itme.id}>${itme.name}</option>
            `;
                    $('#city_top').append(top);
                    let form = layui.form;
                    form.render('#ace')
                    $('#city_buttom').append(top);

                })
            }
        }
    })
}
city()

// ====================分类操作下拉=====================
// ======================筛选操作====================
$('#form_top12').on('submit', function(e) {
        e.preventDefault();
        let fenlei = $('#city_top').val();
        let zhuangtai = $('#zhuangtai').val();
        data_A.state = zhuangtai;
        data_A.cate_id = fenlei;
        data_s()
    })
    // ======================筛选操作end====================
    //渲染数据到分类------------------
    // 点击更换头像切换页面--------------------------
$('.ghtx').click(function() {

    $('.txmin').show().siblings().hide();

  ajaxa()
    // $('.min').hide()
    // $('.czmmmin').hide();
    // $(".jbzlmin").hide()
});
// 点击更换头像切换页面end--------------------------
//  点击首页切换页面--------------------------
$('.index').click(function() {
        $('.min').show()
    })
    //  点击首页切换页面end---------------------
    // 点击重置密码切换页面--------------------------
$('.czmm').click(function() {
    $('.czmmmin').show().siblings().hide();
    // $('.txmin').hide()
    // $('.min').hide()
    // $(".jbzlmin").hide()
});
$('.wzlb').click(function() {
    $('.wzlbmin').show().siblings().hide();
    city()
    data_s()
});
$('.wzfb').click(function() {
    $('.wzfbmin').show().siblings().hide();
    lbglfun()
    city()
    ajaxa()

});



// 点击重置密码切换页面end--------------------------
// 点击切换基本资料页面--------------------
$('.jbzl').click(function() {
        // $('.czmmmin').hide();
        // $('.txmin').hide()
        // $('.min').hide()
        $(".jbzlmin").show().siblings().hide();
        ajaxa()
    })
    // 点击切换基本资料页面end--------------------
    //点击类别管理切换------------------
$('.nbgl').click(function() {
        // $('.czmmmin').hide();
        // $('.txmin').hide()
        // $('.min').hide()
        $(".nbglmin").show().siblings().hide();
        ajaxa()
    })
    //点击类别管理切换end------------------








// ---------------更新用户信息-----------------
$('.jbzlmin form').on('submit', function(e) {
    e.preventDefault();

    let data = $(this).serializeArray()
    $.ajax({
        url: '/my/user/userinfo',
        type: 'POST',
        data: data,
        success: function(res) {
          console.log(res)
            if (res.status == 0) {
              layer.msg(res.message)

                ajaxa()

            }
        }
    })
})

// ---------------更新用户信息end-----------------
// -----------------重置按钮----------------------
$('.czbtn').click(function() {
        ajaxa()
    })
    // -----------------重置按钮end----------------------
    //----------------更新密码-------------------
$('.czmmmin form').on('submit', function(e) {
        e.preventDefault();
        let data = $(this).serializeArray()
        $.ajax({
            url: '/my/user/updatepwd',
            type: 'POST',
            data: data,
            success: function(res) {

                if (res.status == 0) {

                    layer.msg('密码修改成功', { time: 1500 }, function() {

                        location.href = '/login.html'

                    })
                } else {
                    layer.msg(res.message)
                }
            }
        })
    })
    //----------------更新密码end-------------------
    // ------------------更新头像---------------------
let image = $('#image');
let option = {
  aspectRatio: 400 / 280,
  preview: '.img-preview'

};

image.cropper(option)
$('button:contains("上传吗")').on('click', function() {

    $('#file').trigger('click')
})
$('#file').on('change', function() {
    if (this.files.length > 0) {
        let fileObj = this.files[0];
      url12 = URL.createObjectURL(fileObj);
      image.cropper('replace', url12)
    }
});
$('button:contains("提交吧")').on('click', function () {
    toux()
})

function toux() {
    let canvas = image.cropper('getCroppedCanvas', { width: 30, height: 30 });
    let base64 = canvas.toDataURL();
    $.ajax({
        type: 'POST',
        url: '/my/user/avatar',
        data: { avatar: base64 },
        success: function(res) {
            if (res.status == 0) {
              console.log(res)
                layer.msg(res.message)
                ajaxa()

            }
        }
    })
}
// ------------------更新头像end---------------------
// ------------------获取类别管理-----------------


function lbglfun() {
    $.ajax({
        url: '/my/category/list',

        success: function(res) {
            if (res.status == 0) {
                console.log(res)
                $('tbody').html('')
                let lb = ''
                lb = ''
                res.data.forEach(itme => {

                    lb = `
                       <tr>
                                    <td >${itme.name}</td>
                                    <td>${itme.alias}</td>
                                    <td>
                                        <button type="button" data-id=${itme.id} data-name=${itme.name} data-alias=${itme.alias} class="layui-btn layui-btn-xs">编辑吗</button>
                                        <button type="button" data-idd=${itme.id} class="layui-btn  layui-btn-danger  layui-btn-xs cs">删除吗</button>
                                    </td>
                                </tr>
                    `;
                    $('.tbody2').append(lb)
                });


            }

        }
    })
}
$('.nbgl').click(function() {
        lbglfun()

    })
    // ------------------获取类别管理end-----------------
    //------------------删除类别-----------------
$('body').on('click', 'button:contains("删除吗")', function() {
        let idd = $(this).data('idd')
        layer.confirm('您确定要删除吗？', {
            btn: ['确定', 'NO'] //按钮
        }, function() {
            console.log(idd);
            $.ajax({
                url: '/my/category/delete',
                data: { id: idd },
                success: function(res) {
                    if (res.status == 0) {
                        lbglfun()
                        layer.msg(res.message, { icon: 1 })
                    }
                }
            })


        }, function() {
            layer.msg('行叭', );
        });
    })
    //------------------删除类别end-----------------
    // --------------------编辑类别--------------------
let biaoji;
$('body').on('click', 'button:contains("编辑吗")', function() {
        biaoji = layer.open({
            type: 1,
            title: '添加类别',
            content: $('#add-form1').html(),
            area: ['500px', '250px']
        });
        let id = $(this).data('id');
        let name = $(this).data('name');
        console.log($(this).data('name'));
        $('.layui-form1 input[name=name]').val(name);
        $('.layui-form1 input[name=alias]').val($(this).data('alias'));
        $('.layui-form1 input[name=id]').val($(this).data('id'))



        $('body').on('click', '#tjbtn', function(e) {
            e.preventDefault();
            let data = $('.layui-form1').serializeArray();
            console.log(data[0])
            $.ajax({
                url: '/my/category/update',
                type: 'POST',
                data: { name: data[0].value, alias: data[1].value, id: id },
                success: function(res) {

                    console.log(res)
                    if (res.status == 0) {
                        layer.close(biaoji)
                        layer.msg(res.message)
                        lbglfun()

                    }

                }
            })
        })








    })
    // --------------------编辑类别end--------------------
    // -------------------点击切换-------------------
    //--------------------添加类别------------------
let addIndex
$('button:contains("添加类别")').on('click', function() {
    addIndex = layer.open({
        type: 1,
        title: '添加类别',
        content: $('#add-form').html(),
        area: ['500px', '250px']
    });


})
$('body').on('click', '#tjbtn', function(e) {
    e.preventDefault();
    let data = $('.layui-form2').serializeArray()
    $.ajax({
        url: '/my/category/add',
        type: 'POST',
        data: data,
        success: function(res) {
            console.log(res)
            if (res.status == 0) {
                lbglfun()
                layer.close(addIndex)
                layer.msg(res.message)


            }

        }
    })
})

//--------------------添加类别end------------------

//----------------退出按钮------------------
$('.on').click(function() {

    layer.confirm('您确定要退出吗？', {
        btn: ['确定', 'NO'] //按钮
    }, function() {

        location.href = './login.html'
        layer.msg('的确很重要', { icon: 1 });
    }, function() {
        layer.msg('行叭', );
    });
})


//----------------退出按钮结束------------------



// ------------------插图----------------------

var oChart = echarts.init(document.getElementById('curve_show'));
var aList_all = [{
    'count': 36,
    'date': '2019-04-13'
}, {
    'count': 52,
    'date': '2019-04-14'
}, {
    'count': 78,
    'date': '2019-04-15'
}, {
    'count': 85,
    'date': '2019-04-16'
}, {
    'count': 65,
    'date': '2019-04-17'
}, {
    'count': 72,
    'date': '2019-04-18'
}, {
    'count': 88,
    'date': '2019-04-19'
}, {
    'count': 64,
    'date': '2019-04-20'
}, {
    'count': 72,
    'date': '2019-04-21'
}, {
    'count': 90,
    'date': '2019-04-22'
}, {
    'count': 96,
    'date': '2019-04-23'
}, {
    'count': 100,
    'date': '2019-04-24'
}, {
    'count': 102,
    'date': '2019-04-25'
}, {
    'count': 110,
    'date': '2019-04-26'
}, {
    'count': 123,
    'date': '2019-04-27'
}, {
    'count': 100,
    'date': '2019-04-28'
}, {
    'count': 132,
    'date': '2019-04-29'
}, {
    'count': 146,
    'date': '2019-04-30'
}, {
    'count': 200,
    'date': '2019-05-01'
}, {
    'count': 180,
    'date': '2019-05-02'
}, {
    'count': 163,
    'date': '2019-05-03'
}, {
    'count': 110,
    'date': '2019-05-04'
}, {
    'count': 80,
    'date': '2019-05-05'
}, {
    'count': 82,
    'date': '2019-05-06'
}, {
    'count': 70,
    'date': '2019-05-07'
}, {
    'count': 65,
    'date': '2019-05-08'
}, {
    'count': 54,
    'date': '2019-05-09'
}, {
    'count': 40,
    'date': '2019-05-10'
}, {
    'count': 45,
    'date': '2019-05-11'
}, {
    'count': 38,
    'date': '2019-05-12'
}, ];

let aCount = [];
let aDate = [];

for (var i = 0; i < aList_all.length; i++) {
    aCount.push(aList_all[i].count);
    aDate.push(aList_all[i].date);
}

var chartopt = {
    title: {
        text: '月新增文章数',
        left: 'center',
        top: '10'
    },
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        data: ['新增文章'],
        top: '40'
    },
    toolbox: {
        show: true,
        feature: {
            mark: {
                show: true
            },
            dataView: {
                show: true,
                readOnly: false
            },
            magicType: {
                show: true,
                type: ['line', 'bar']
            },
            restore: {
                show: true
            },
            saveAsImage: {
                show: true
            }
        }
    },
    calculable: true,
    xAxis: [{
        name: '日',
        type: 'category',
        boundaryGap: false,
        data: aDate
    }],
    yAxis: [{
        name: '月新增文章数',
        type: 'value'
    }],
    series: [{
        name: '新增文章',
        type: 'line',
        smooth: true,
        itemStyle: {
            normal: {
                areaStyle: {
                    type: 'default'
                },
                color: '#f80'
            },
            lineStyle: {
                color: '#f80'
            }
        },
        data: aCount
    }],
    areaStyle: {
        normal: {
            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: 'rgba(255,136,0,0.39)'
            }, {
                offset: .34,
                color: 'rgba(255,180,0,0.25)'
            }, {
                offset: 1,
                color: 'rgba(255,222,0,0.00)'
            }])

        }
    },
    grid: {
        show: true,
        x: 50,
        x2: 50,
        y: 80,
        height: 220
    }
};

oChart.setOption(chartopt);


var oPie = echarts.init(document.getElementById('pie_show'));
var oPieopt = {
    title: {
        top: 10,
        text: '分类文章数量比',
        x: 'center'
    },
    tooltip: {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    color: ['#5885e8', '#13cfd5', '#00ce68', '#ff9565'],
    legend: {
        x: 'center',
        top: 65,
        data: ['奇趣事', '会生活', '爱旅行', '趣美味']
    },
    toolbox: {
        show: true,
        x: 'center',
        top: 35,
        feature: {
            mark: {
                show: true
            },
            dataView: {
                show: true,
                readOnly: false
            },
            magicType: {
                show: true,
                type: ['pie', 'funnel'],
                option: {
                    funnel: {
                        x: '25%',
                        width: '50%',
                        funnelAlign: 'left',
                        max: 1548
                    }
                }
            },
            restore: {
                show: true
            },
            saveAsImage: {
                show: true
            }
        }
    },
    calculable: true,
    series: [{
        name: '访问来源',
        type: 'pie',
        radius: ['45%', '60%'],
        center: ['50%', '65%'],
        data: [{
            value: 300,
            name: '奇趣事'
        }, {
            value: 100,
            name: '会生活'
        }, {
            value: 260,
            name: '爱旅行'
        }, {
            value: 180,
            name: '趣美味'
        }]
    }]
};
oPie.setOption(oPieopt);



var oColumn = this.echarts.init(document.getElementById('column_show'));
var oColumnopt = {
    title: {
        text: '文章访问量',
        left: 'center',
        top: '10'
    },
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        data: ['奇趣事', '会生活', '爱旅行', '趣美味'],
        top: '40'
    },
    toolbox: {
        show: true,
        feature: {
            mark: {
                show: true
            },
            dataView: {
                show: true,
                readOnly: false
            },
            magicType: {
                show: true,
                type: ['line', 'bar']
            },
            restore: {
                show: true
            },
            saveAsImage: {
                show: true
            }
        }
    },
    calculable: true,
    xAxis: [{
        type: 'category',
        data: ['1月', '2月', '3月', '4月', '5月']
    }],
    yAxis: [{
        name: '访问量',
        type: 'value'
    }],
    series: [{
        name: '奇趣事',
        type: 'bar',
        barWidth: 20,
        itemStyle: {
            normal: {
                areaStyle: {
                    type: 'default'
                },
                color: '#fd956a'
            }
        },
        data: [800, 708, 920, 1090, 1200]
    }, {
        name: '会生活',
        type: 'bar',
        barWidth: 20,
        itemStyle: {
            normal: {
                areaStyle: {
                    type: 'default'
                },
                color: '#2bb6db'
            }
        },
        data: [400, 468, 520, 690, 800]
    }, {
        name: '爱旅行',
        type: 'bar',
        barWidth: 20,
        itemStyle: {
            normal: {
                areaStyle: {
                    type: 'default'
                },
                color: '#13cfd5'
            }
        },
        data: [500, 668, 520, 790, 900]
    }, {
        name: '趣美味',
        type: 'bar',
        barWidth: 20,
        itemStyle: {
            normal: {
                areaStyle: {
                    type: 'default'
                },
                color: '#00ce68'
            }
        },
        data: [600, 508, 720, 890, 1000]
    }],
    grid: {
        show: true,
        x: 50,
        x2: 30,
        y: 80,
        height: 260
    },
    dataZoom: [ //给x轴设置滚动条
        {
            start: 0, //默认为0
            end: 100 - 1000 / 31, //默认为100
            type: 'slider',
            show: true,
            xAxisIndex: [0],
            handleSize: 0, //滑动条的 左右2个滑动条的大小
            height: 8, //组件高度
            left: 45, //左边的距离
            right: 50, //右边的距离
            bottom: 26, //右边的距离
            handleColor: '#ddd', //h滑动图标的颜色
            handleStyle: {
                borderColor: "#cacaca",
                borderWidth: "1",
                shadowBlur: 2,
                background: "#ddd",
                shadowColor: "#ddd",
            }
        }
    ]
};
oColumn.setOption(oColumnopt);


// ------------------插图----------------------
// ----------------后台页面结束js------------------